<?php
/**
 * The template for displaying all single posts
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/#single-post
 *
 * @package WordPress
 * @subpackage Twenty_Seventeen
 * @since 1.0
 * @version 1.0
 */

get_header("loopart"); ?>

<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/css/loopart-old.css" />
<script src="<?php echo get_template_directory_uri(); ?>/js/jquery-2.1.3.min.js"></script>
<script src="<?php echo get_template_directory_uri(); ?>/js/jquery_kv.js"></script>

<div class="wrap body body2 ">
	<div id="" class="content-area">
		<main id="main" class="site-main" role="main">


			<?php
			/* Start the Loop */
			while ( have_posts() ) : the_post();

				$title = $post->post_title;
				$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'large');

				$images = get_content_image( $post->post_content );
				$firstimage = $images[0];
				$content = preg_replace('/<img[^>]+>/i','', $post->post_content);

			?>
				<div class="content">
					<div class="title"><span class="first">LOOP-ART  </span><span class="second">/ <?php echo $title ?></span></div>
					<div class="circle"><img src="<?php echo $large_image_url[0]; ?>" /></div>
					<div class="detail">
						<h3 class="title2"><?php echo $title; ?></h3>
						<?php echo $content; ?>
					</div>
				</div>
				<ul class="loops">
					<?php
						for ($i = 0; $i < count($images); $i++) {
					?>
							<li><img src="<?php echo $images[$i]; ?>" oncontextmenu="return false;" onselectstart="return false" ondragstart="return false"></li>
					<?php
						}
					?>
				</ul>

			<?php
			endwhile; // End of the loop.
			?>

		</main><!-- #main -->
	</div><!-- #primary -->
</div><!-- .wrap -->

<?php get_footer();
